<template>
	<div>
		<home-header></home-header>
		<home-swiper :list="swiperList"></home-swiper>
		<home-icon :list="iconList"></home-icon>
		<home-recommend :list="recommendList"></home-recommend>
		<home-weekend :list="weekendList"></home-weekend>
	</div>
</template>

<script>
//局部组件（要先引用，后申明）
import HomeHeader from './components/Header'
import HomeSwiper from './components/Swiper'
import HomeIcon from './components/Icon'
import HomeRecommend from './components/Recommend'
import HomeWeekend from './components/Weekend'
import axios from 'axios'
import { mapState} from 'vuex'
export default {
  name: 'Home',
  components:{
  	HomeHeader,
  	HomeSwiper,
	HomeIcon,
	HomeRecommend,
	HomeWeekend
  },
  data () {
  	return {
  		lastCity: '',
  		swiperList:[],
  		iconList:[],
  		recommendList:[],
  		weekendList:[]
  	}
  },
  computed: {
  	...mapState(['city'])
  },
methods:{
	getHomeInfo () {
		axios.get('/static/mock/index.json?city=' + this.city)
			.then(this.getHomeInfoSucc)
	},
	getHomeInfoSucc (res) {
		res=res.data
		if(res.ret && res.data){
			const data=res.data
			this.swiperList=data.swiperList
			this.iconList=data.iconList
			this.recommendList=data.recommendList
			this.weekendList=data.weekendList
		}
//		console.log(this.swiperList)
//		console.log(res)
	}
},
	mounted () {
		this.lastCity = this.city
//		console.log('mounted')
		this.getHomeInfo()
	},
	activated () {
		if(this.lastCity !== this.city){
			this.lastCity = this.city
			this.getHomeInfo()
		}
	}
	
//	created () {
//		axios.get('/static/mock/index.json').then( (res) =>{
//			 res = res.data
//			if(res){
//				this.swiperList = res.data.swiperList
//				console.log(this.swiperList)
//			}
//		})
//	}
}
</script>

<style>
</style>